<template>
    <div>
        <up-checkbox-group v-model="checkboxValue1" @change="checkboxChange">
            <div v-for="item in orderLists" style="width:100%;">

                <div class="Unallocated" v-if="item.isAllot == '1'">
                    <up-checkbox activeColor="#ff6a00" shape="circle" :name="item.orderId"
                        v-show="isDelete"></up-checkbox>

                    <div class="content">
                        <div class="content_top">
                            <div class="product_name">产品名称：{{ item.productName ? item.productName : '无' }}</div>

                            <div class="product_person">成交人：{{ item.addPeople ? item.addPeople : '无' }}</div>

                        </div>
                        <div class="content_bottom">
                            <div class="text">成交金额：<span style="color:#ff6a00">{{ item.amount ? item.amount : '无'
                                    }}</span>
                            </div>
                            <div class="text">订单业绩：<span style="color:#ff6a00">{{ item.achievement ? item.achievement :
                                '无'
                                    }}</span> </div>
                            <div class="text">姓名：<span>{{ item.name ? item.name : '无' }}</span> </div>
                            <div class="text" style="white-space: nowrap;">
                                联系方式1:<span>{{ item.phoneFirst ? item.phoneFirst : '无' }}</span> </div>
                            <div class="text">数量：<span>1</span> </div>
                    <div class="text">是否退费：<span :style="{ color: item.isReturns == '1' ? 'red' : '#666' }">{{
                        item.isReturns == '1' ? '是' : '否' }}</span> </div>
                            <div class="text" v-show="item.isReturns == '1'">退费金额：<span style="color: red;">{{
                                item.retAchievement ? item.retAchievement :
                                    '无' }}</span> </div>
                            <div class="text" v-show="item.isReturns == '1'">退费业绩：<span style="color:red">{{
                                item.retAmount ? item.retAmount : '无'
                                    }}</span>
                            </div>
							
                            <div class="text"><span style="color: rgba(203,164,63,1)">暂未分配</span> </div>
                            <div class="text" style="width:100%">成交时间：<span>{{ item.dealTime ? item.dealTime : '无'
                                    }}</span>
                            </div>


                        </div>
                        <div class="icon_box">

                        </div>


                    </div>
                </div>
                <div class="Unallocated" v-if="item.isAllot == '2'">
                    <up-checkbox activeColor="#ff6a00" shape="circle" :name="item.orderId"
                        v-show="isDelete"></up-checkbox>
                    <div class="content">
                        <div class="content_top">
                            <div class="product_name">产品名称：{{ item.productName }}</div>
                            <div class="product_person">成交人：{{ item.addPeople }}</div>
                        </div>
                        <div class="content_bottom">
                            <div class="text">成交金额：<span style="color:#ff6a00">{{ item.amount }}</span>
                            </div>
                            <div class="text">订单业绩：<span style="color:#ff6a00">{{ item.achievement
                                    }}</span> </div>
                            <div class="text">姓名：<span>{{ item.name }}</span> </div>
                            <div class="text" style="white-space: nowrap;" v-show="item.phoneFirst">
                                联系方式1:<span>{{ item.phoneFirst }}</span> </div>
                            <div class="text">数量：<span>1</span> </div>
                            <div class="text">是否退费：<span :style="{ color: item.isReturns == '1' ? 'red' : '#666' }">{{
                                item.isReturns == '1' ? '是' : '否' }}</span> </div>
                            <div class="text" v-show="item.isReturns == '1'">退费金额：<span style="color: red;">{{
                                item.retAchievement }}</span> </div>
                            <div class="text" v-show="item.isReturns == '1'">退还业绩：<span style="color:red">{{
                                item.retAmount
                                    }}</span> </div>
                            <div v-for="item1, index1 in item.data" style="width: 100%;display: flex;">
                                <div class="text" style="white-space: nowrap;">分配员工{{ index1 + 1 }}：<span>{{ item1.name
                                        }}</span> </div>
                                <div class="text" style="white-space: nowrap;">分配业绩{{ index1 + 1 }}：<span>{{
                                    item1.achievement
                                        }}</span> </div>
                            </div>
                            <div class="text">成交时间：<span>{{ item.dealTime }}</span> </div>
                            <div class="text" style="width: 100%;">订单编号：<span>{{ item.orderNumber }}</span> </div>

                        </div>
                        <div class="icon_box">

                        </div>


                    </div>
                </div>
            </div>

            <div v-show="orderLists.length == 0">
                <div class="noData">
                    <image src="/static/imgs/myClue/noData.png" mode="" style="max-height: 100%;max-width: 100%;"></image>
                </div>
            </div>
        </up-checkbox-group>

    </div>
</template>

<script setup>
import { ref } from 'vue'
import emitter from '../../../utils/eventBus'
const props = defineProps({
    orderLists: {
        type: Array,
        default: () => []
    }
})
const toOrderEdit = (item) => {
    uni.navigateTo({
        url: '/pages/OrderEdit/OrderEdit?userObject=' + JSON.stringify(item)
    })
}

const openAssignmentModal = (item) => {
    emitter.emit('openModal', item)
}
</script>


<style lang="scss">
.Unallocated {
    width: 100%;
    border-bottom: 1px solid rgba(239, 239, 239, 1);
    background-color: #fff;
    padding-left: 42rpx;
    display: flex;
    position: relative;

    // align-items: center;
    .u-checkbox {
        display: block;
        padding-top: 20rpx;
    }

    .content {
        flex: 1;
        padding: 20rpx;
        padding-right: 30rpx;

        .content_top {
            display: flex;
            justify-content: space-between;
            padding-right: 40rpx;

            .product_name {
                color: rgba(108, 108, 108, 1);
                font-size: 28rpx;
                text-align: left;
                font-family: PingFangSC-medium;
            }

            .product_person {
                color: rgba(108, 108, 108, 1);
                font-size: 28rpx;
                text-align: left;
                font-family: PingFangSC-regular;
            }

        }

        .content_bottom {
            display: flex;
            flex-wrap: wrap;
            padding-bottom: 30rpx;

            .text {
                width: 50%;
                color: rgba(108, 108, 108, 1);
                font-size: 28rpx;
                text-align: left;
                font-family: PingFangSC-light;
            }
        }

    }

    .icon_box {
        position: absolute;
        right: 60rpx;
        bottom: 0
    }

}


.noData {
  	width: 444rpx;
		height: 444rpx;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%,-50%);
}
</style>